<!DOCTYPE html>
<html>
<head>
    <title>Logo Generator</title>
</head>
<body>
    <canvas id="logoCanvas" width="64" height="64" style="border: 1px solid #ccc;"></canvas>
    <br><br>
    <button onclick="downloadLogo()">下载 logo.png</button>
    
    <script>
        const canvas = document.getElementById('logoCanvas');
        const ctx = canvas.getContext('2d');
        
        // 创建渐变背景
        const gradient = ctx.createLinearGradient(0, 0, 64, 64);
        gradient.addColorStop(0, '#667eea');
        gradient.addColorStop(1, '#764ba2');
        
        // 绘制圆角矩形背景
        ctx.fillStyle = gradient;
        ctx.beginPath();
        ctx.roundRect(4, 4, 56, 56, 12);
        ctx.fill();
        
        // 绘制文字
        ctx.fillStyle = 'white';
        ctx.font = 'bold 18px Arial';
        ctx.textAlign = 'center';
        ctx.textBaseline = 'middle';
        ctx.fillText('MMC', 32, 32);
        
        function downloadLogo() {
            const link = document.createElement('a');
            link.download = 'logo.png';
            link.href = canvas.toDataURL();
            link.click();
        }
    </script>
</body>
</html> 